@size: 17.07vw;

body {
    margin: 0;
    background-image: url(../images/pf.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.top-nav {
    .top {
        width: 100%;
        height: (80 / @size);
        line-height: (80 / @size);
        background-color: rgba(231, 230, 233, 0);
        .container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100%;
        }
        .ul {
            display: flex;
            flex-direction: row;
            justify-content: center;
            .li {
                font-style: normal;
                list-style: none;
                margin-right: (50 / @size);
                margin-left: (50 / @size);
                font-size: (20 / @size);
                &:first-of-type {
                    font-size: (30 / @size);
                    font-style: italic;
                }
                a {
                    text-decoration: none;
                    color: #181616;
                }
            }
        }

    }
}

.discuss {
    margin-top: (30 / @size);
    .wrapper {
      textarea {
        background-color: transparent;
        width: 100%;
        height: (150 / @size);
        font-size: (30 / @size);
      }
      button {
        float: right;
        width: (100 / @size);
        height: (30 / @size);
      }
    }
    .list {
      margin-top: (50 / @size);
    }
  }
  

.footer {
    text-align: center;
}